<script lang="ts" setup>
import {
  getOneByCondition,
  getReadonly,
  insertOne,
  reSetDialogModel,
  updateOne,
  urls
} from '@/index';

import type { DialogModel, NdeReportRejectPart } from '@/index.d';
import type { FormInstance, FormRules } from 'element-plus';

import { makeMethodList, ownerList, partTypeList, provinceList, testStageList } from './optionList';

const dialogModel = defineModel<DialogModel<NdeReportRejectPart>>('dialogModel', {
  required: true
});

const { updateForbidden } = getReadonly(dialogModel.value);

const formData = reactive<NdeReportRejectPart>({
  id: 0
});

const setFormData = async (res: NdeReportRejectPart) => {
  formData.id = res.id;
  formData.creator = res.creator;
  formData.createTime = res.createTime;
  formData.updater = res.updater;
  formData.updateTime = res.updateTime;
  formData.owner = res.owner;
  formData.province = res.province;
  formData.reportReference = res.reportReference;
  formData.testMethod = res.testMethod;
  formData.productionReference = res.productionReference;
  formData.partReference = res.partReference;
  formData.partName = res.partName;
  formData.testStage = res.testStage;
  formData.partType = res.partType;
  formData.makeMethod = res.makeMethod;
  formData.testDate = res.testDate;
  formData.reportAttachmentUuid = res.reportAttachmentUuid;
  formData.reportAttachmentLink = res.reportAttachmentLink;
};

const reSetFormData = () => {
  reSetDialogModel(dialogModel);
  formData.id = 0;
  delete formData.owner;
  delete formData.province;
  delete formData.reportReference;
  delete formData.testMethod;
  delete formData.productionReference;
  delete formData.partReference;
  delete formData.partName;
  delete formData.testStage;
  delete formData.partType;
  delete formData.makeMethod;
  delete formData.testDate;
};

watch(
  () => dialogModel.value.visible,
  value => {
    value && (formData.id = dialogModel.value.id as number);
    !value && reSetFormData();
  },
  {
    immediate: true
  }
);

watch(
  () => formData.id,
  async (value: number | undefined) => {
    if (value) {
      const res = await getOneByCondition<NdeReportRejectPart>(
        urls.ndeReportRejectPart,
        'id',
        value
      );
      res && setFormData(res);
    }
  },
  {
    immediate: true
  }
);

watch(
  () => formData.reportReference,
  async (value: string | undefined) => {
    if (value) {
      const res = value.split('-');
      formData.testMethod = res[0];
      formData.productionReference = res[1] + '-' + res[2];
    }
  }
);

const formDataRef = ref<FormInstance>();

interface FormDataRules {
  owner: string;
  province: string;
  testMethod: string;
  reportReference: string;
  productionReference: string;
  partName: string;
  partReference: string;
  partType: string;
  makeMethod: string;
  testStage: string;
  testDate: string;
}

const formDataRules = computed(() => {
  switch (dialogModel.value.type) {
    case 'view':
      return reactive({});

    case 'update':
      return reactive<FormRules<FormDataRules>>({
        owner: [{ required: true, message: '业主不能为空', trigger: 'blur' }],
        province: [{ required: true, message: '所在省不能为空', trigger: 'blur' }],
        testMethod: [{ required: true, message: '检测方法不能为空', trigger: 'blur' }],
        reportReference: [{ required: true, message: '报告编号不能为空', trigger: 'blur' }],
        productionReference: [{ required: true, message: '生产令号不能为空', trigger: 'blur' }],
        partName: [{ required: true, message: '工件名称不能为空', trigger: 'blur' }],
        partReference: [{ required: true, message: '工件编号不能为空', trigger: 'blur' }],
        partType: [{ required: true, message: '工件类型不能为空', trigger: 'blur' }],
        makeMethod: [{ required: true, message: '加工方式不能为空', trigger: 'blur' }],
        testStage: [{ required: true, message: '检测时机不能为空', trigger: 'blur' }],
        testDate: [{ required: true, message: '检测日期不能为空', trigger: 'blur' }]
      });

    case 'insert':
      return reactive<FormRules<FormDataRules>>({
        owner: [{ required: true, message: '业主不能为空', trigger: 'blur' }],
        province: [{ required: true, message: '所在省不能为空', trigger: 'blur' }],
        testMethod: [{ required: true, message: '检测方法不能为空', trigger: 'blur' }],
        reportReference: [{ required: true, message: '报告编号不能为空', trigger: 'blur' }],
        productionReference: [{ required: true, message: '生产令号不能为空', trigger: 'blur' }],
        partName: [{ required: true, message: '工件名称不能为空', trigger: 'blur' }],
        partReference: [{ required: true, message: '工件编号不能为空', trigger: 'blur' }],
        partType: [{ required: true, message: '工件类型不能为空', trigger: 'blur' }],
        makeMethod: [{ required: true, message: '加工方式不能为空', trigger: 'blur' }],
        testStage: [{ required: true, message: '检测时机不能为空', trigger: 'blur' }],
        testDate: [{ required: true, message: '检测日期不能为空', trigger: 'blur' }]
      });
  }
});

const saveFormData = (formEl: FormInstance | undefined) => {
  if (!formEl) return;
  formEl
    .validate()
    .then(async valid => {
      if (valid) {
        if (dialogModel.value.id === 0) {
          const res = (await insertOne<NdeReportRejectPart>(
            urls.ndeReportRejectPart,
            formData
          )) as NdeReportRejectPart;
          if (res) {
            setFormData(res);
            dialogModel.value.id = res.id as number;
            dialogModel.value.type = 'update';
            dialogModel.value.change = true;
          }
        } else {
          const tempFormData: NdeReportRejectPart = {
            id: formData.id,
            owner: formData.owner,
            province: formData.province,
            testMethod: formData.testMethod,
            reportReference: formData.reportReference,
            productionReference: formData.productionReference,
            partName: formData.partName,
            partReference: formData.partReference,
            partType: formData.partType,
            makeMethod: formData.makeMethod,
            testStage: formData.testStage,
            testDate: formData.testDate
          };

          const res = (await updateOne<NdeReportRejectPart>(
            urls.ndeReportRejectPart,
            tempFormData
          )) as NdeReportRejectPart;

          if (res) {
            dialogModel.value.change = true;
            formData.updater = res.updater;
            formData.updateTime = res.updateTime;
          }
        }
      }
    })
    .catch(res => console.log(res));
};
</script>
<template>
  <HqDialogDetail
    :dialog-model="dialogModel"
    @submit="saveFormData(formDataRef)"
    operate-record
    :operation="formData"
  >
    <template #default>
      <el-card shadow="hover">
        <template #header>基本信息</template>
        <template #default>
          <hq-form :model="formData" ref="formDataRef" :rules="formDataRules">
            <el-row :gutter="5">
              <hq-col v-show="false">
                <el-form-item label="id" prop="id">
                  <el-input v-model="formData.id" readonly />
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="检测日期" prop="testDate">
                  <el-date-picker
                    v-model="formData.testDate"
                    type="date"
                    format="YYYY-MM-DD"
                    value-format="YYYY-MM-DD"
                    :readonly="updateForbidden"
                  />
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="报告编号" prop="reportReference">
                  <el-input v-model="formData.reportReference" :disabled="updateForbidden" />
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="检测方法" prop="testMethod">
                  <el-select
                    v-model="formData.testMethod"
                    placeholder="请选择检测方法"
                    :disabled="updateForbidden"
                  >
                    <HqNdeMethodOptions />
                  </el-select>
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="生产令号" prop="productionReference">
                  <el-input v-model="formData.productionReference" :disabled="updateForbidden" />
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="工件编号" prop="partReference">
                  <el-input v-model="formData.partReference" :disabled="updateForbidden" />
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="工件名称" prop="partName">
                  <el-input v-model="formData.partName" :disabled="updateForbidden" />
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="检测时机" prop="testStage">
                  <el-select
                    v-model="formData.testStage"
                    placeholder="请选择检测时机"
                    :disabled="updateForbidden"
                  >
                    <el-option
                      v-for="item in testStageList"
                      :value="item"
                      :label="item"
                      :key="item"
                    />
                  </el-select>
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="工件类型" prop="partType">
                  <el-select
                    v-model="formData.partType"
                    placeholder="请选择工件类型"
                    :disabled="updateForbidden"
                  >
                    <el-option
                      v-for="item in partTypeList"
                      :value="item"
                      :label="item"
                      :key="item"
                    />
                  </el-select>
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="加工方式" prop="makeMethod">
                  <el-select
                    v-model="formData.makeMethod"
                    placeholder="请选择加工方式"
                    :disabled="updateForbidden"
                  >
                    <el-option
                      v-for="item in makeMethodList"
                      :value="item"
                      :label="item"
                      :key="item"
                    />
                  </el-select>
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="业主" prop="owner">
                  <el-select
                    v-model="formData.owner"
                    placeholder="请选择业主"
                    :disabled="updateForbidden"
                  >
                    <el-option v-for="item in ownerList" :value="item" :label="item" :key="item" />
                  </el-select>
                </el-form-item>
              </hq-col>
              <hq-col>
                <el-form-item label="所在省" prop="province">
                  <el-select
                    v-model="formData.province"
                    placeholder="请选择所在省"
                    :disabled="updateForbidden"
                  >
                    <el-option
                      v-for="item in provinceList"
                      :value="item"
                      :label="item"
                      :key="item"
                    />
                  </el-select>
                </el-form-item>
              </hq-col>
            </el-row>
          </hq-form>
        </template>
      </el-card>
      <el-card shadow="hover" v-if="formData.reportAttachmentUuid">
        <template #header>报告附件</template>
        <template #default>
          <HqUploadOne
            :key-word="formData.reportAttachmentUuid"
            :disabled="dialogModel.type !== 'update'"
          />
        </template>
      </el-card>
    </template>
  </HqDialogDetail>
</template>
<style lang="scss" scoped></style>
